
var space_items = {};
var actions = [];
var canvas = null;
var ctx = null;
var turn = 0;
var map_scale = 2;
var player_colors = {1:'red',2:'blue',3:'green',4:'orange',5:'black',6:'gold'};
var camera_x = 0;
var camera_y = 0;
var zoom = 1.0;
var mouse_x = 0;
var mouse_y = 0;
var selected = null;
var player = 1;

$(document).ready(function(){

	
	$("#up").click(function(event){
		event.preventDefault();
		camera_y += 20;
		draw_map();
	});
	
	$("#down").click(function(event){
		event.preventDefault();
		camera_y -= 20;
		draw_map();
	});
	
	$("#right").click(function(event){
		event.preventDefault();
		camera_x -= 5;
		draw_map();
	});
	
	$("#left").click(function(event){
		event.preventDefault();
		camera_x += 5;
		draw_map();
	});
	
	$("#in").click(function(event){
		event.preventDefault();
		zoom += 0.1;
		draw_map();
	});
	
	$("#out").click(function(event){
		event.preventDefault();
		zoom -= 0.1;
		if(zoom <= 0.0)
		{
			zoom = 0.1;
		}
		draw_map();
	});
	
	$.getJSON("http://localhost:8080/get_player_view/1",
			function(data){
				turn = data.turn;
				space_items = data.view;
				actions = data.actions;
				$('#game_info').html('Turn ' + turn.toString())
				
				draw_map();
			});
	
	space_items = {};
	actions = [];
	
	$('#canvas').mousemove(function(e){
		var zoom_rep = 1.0/zoom;
		mouse_x = Math.round((e.pageX - canvas.offsetLeft - camera_x) * zoom_rep);
		mouse_y = Math.round((e.pageY - canvas.offsetTop - camera_y) * zoom_rep);
		$('#status').html(mouse_x+', '+mouse_y);
		detect_over(mouse_x,mouse_y);
		});

});

function draw_selected()
{
	if(selected != null)
	{
		ctx.beginPath();  
		ctx.strokeStyle = "black";
		ctx.arc(selected.x + 2,selected.y + 2,5,0,Math.PI*2,true); // Outer circle 
		ctx.stroke();
	}
}

function detect_over(x,y)
{
	for(var i in space_items)
	{
		var delta_x = x - space_items[i].x;
		var delta_y = y - space_items[i].y;
		if (5 > delta_x && delta_x > 0)
		{
			if (5 > delta_y && delta_y > 0)
			{
				$('#over').html(object_2_string(space_items[i]));
				selected = space_items[i];
				draw_map();
			}
		}
	}
}

function draw_action(action)
{
	if (action.type == 'attack')
	{
		var attacker = space_items[action['atk']];
		var target = space_items[action['tgt']];
		ctx.strokeStyle = "rgba(230, 0, 200, 0.3)";
		ctx.beginPath();
		ctx.moveTo(attacker.x, attacker.y);
		ctx.lineTo(target.x, target.y);
		ctx.stroke();
	}
	
	else if (action.type == 'move')
	{
		var ship = space_items[action['idx']];
		var target_x = action['x'];
		var target_y = action['y'];
		ctx.strokeStyle = "rgba(200, 200, 200, 0.3)";
		ctx.beginPath();
		ctx.moveTo(ship.x, ship.y);
		ctx.lineTo(target_x, target_y);
		ctx.stroke();
	}
}

function refresh_map()
{
	canvas = document.getElementById("canvas");
	ctx = canvas.getContext("2d");
	
	$.getJSON("http://localhost:8080/get_player_view",
			function(data){
				turn = data.turn;
				space_items = data.view;
				actions = data.actions;
				$('#game_info').html('Turn ' + turn.toString())
				
				draw_map();
			});
	
	space_items = {};
	actions = [];
}

function draw_map()
{
	ctx.clearRect(0,0,960,400);
	ctx.save();
	ctx.translate(camera_x,camera_y);
	ctx.scale(zoom,zoom);  
	
	draw_selected();
	
	$.each(actions, function(i,item){
		draw_action(item);
	});
	
	
	for(var i in space_items)
	{
		draw_space_item(space_items[i]);
	}
	
	ctx.restore(); 
}

function draw_space_item(item)
{
	if(item.type == 'ship')
	{
		//ships.push(item);
		draw_ship(item,ctx);
	}
	else if(item.type == 'base')
	{
		draw_base(item,ctx);
	}
	else if(item.type == 'asteroid')
	{
		draw_asteroid(item,ctx);
	}
}

function draw_ship(ship)
{
	ctx.fillStyle = player_colors[ship.player];
	ctx.fillRect (ship.x, ship.y, 2, 2);
}

function draw_base(base)
{
	ctx.fillStyle = player_colors[base.player];
	ctx.fillRect (base.x, base.y, 7, 7);
}

function draw_asteroid(item)
{
	ctx.fillStyle = "rgba(120, 120, 120, 0.5)";
	ctx.fillRect (item.x, item.y, 4, 4);
}

function object_2_string(o)
{
	var str = '';
	for(var i in o)
	{
		str += i + ':' + o[i].toString() + ' ';
	}
	return str;
}